<template>
	<view class="wrap">
		<u-row gutter="16"  class="header">
			<u-col span="3">
				<view >
					<u-icon name="calendar-fill" color="#2979ff" size="30"></u-icon>
					{{itemInfo.creatdate}}
				</view>
			</u-col>
			<u-col span="5">
				<view class="demo-layout bg-purple">
					{{itemInfo.jsh}}
				</view>
			</u-col>
			<u-col span="4">
				<view class="demo-layout bg-purple" style="display: flex;">
					
				<u-icon name="car-fill" color="#2979ff" size="30"></u-icon>
				<view style="flex: 2;">{{cj(itemInfo.cj)}} </view>
				<u-image 
				mode="aspectFit"
				:fade="true"
				style="flex: 0.5;" width="40rpx" height="40rpx" :src="itemInfo.banci=='day'?'/static/aidex/images/day.png':'/static/aidex/images/night.png'">
					<u-loading slot="载入中……"></u-loading>
					<view slot="error" style="font-size: 24rpx;">加载失败</view>
				</u-image>
				
				</view>
			</u-col>
		</u-row>
		<u-row gutter="16" class="fwjlContntDiv">
			<u-col span="12">
				<view class="demo-layout bg-purple">
					<uni-text>车型：</uni-text>
				
					{{itemInfo.cxch}}
				</view>
			</u-col>
			<u-col span="12">
				<view class="demo-layout bg-purple">
					<uni-text>车类：</uni-text>
					{{itemInfo.pt}}{{itemInfo.cx}}
				</view>
			</u-col>
			<u-col span="12">
				<view class="demo-layout bg-purple">
					<uni-text>流水号 :</uni-text>
					{{itemInfo.lsh}}
				</view>
			</u-col>
			<u-col span="12">
				<view class="demo-layout bg-purple">
					<uni-text>协议：</uni-text>
					{{itemInfo.xy}}
				</view>
			</u-col>
			<u-col span="12">
				<view class="demo-layout bg-purple">
					<uni-text>类别：</uni-text>
					{{leibie(itemInfo.leibie)}}
				</view>
			</u-col>
			<u-col span="12">
				<view class="demo-layout bg-purple">
					<uni-text>记录者：</uni-text>
					{{itemInfo.nickname}}
				</view>
			</u-col>
		</u-row>
		<u-row gutter="16"  class="fwjlContntDiv">
			<u-col span="12">
				<view class="demo-layout bg-purple">
					<uni-text>记录内容：</uni-text>
					{{itemInfo.content}}
				</view>
			</u-col>
			
		</u-row>
		<u-row gutter="16"  class="fwjlContntDiv">
			<u-col span="12">
				<view class="demo-layout bg-purple">
					<uni-text>现场处理：</uni-text>
					{{itemInfo.chuli}}
				</view>
			</u-col>
			
		</u-row>
		<u-row gutter="16"  class="fwjlContntDiv">
			<u-col span="12">
				<view class="demo-layout bg-purple" v-for="(item,i) in picArr">
					<u-image width="300rpx" height="300rpx" :src="getImage(item.savename)" @click="imgPreview(i)"></u-image>
				</view>	
			</u-col>
		</u-row>
		<u-row gutter="16"  class="fwjlContntDiv">
			<u-col span="12">
				<view class="demo-layout bg-purple" v-if="itemInfo.huifu!=''">
					<uni-text>回复：</uni-text>
					
					{{itemInfo.huifu}}
				</view>
				<view class="demo-layout bg-purple" v-else="itemInfo.huifu!=''">
					
					没有回复内容
				</view>
			</u-col>
			
		</u-row>	
	</view>
</template>

<script>
	export default {
		data() {
			return {
				itemInfo:[],
				picArr:[]
			}
		},
		methods: {
			getFwjlInfo(id) {
				var phoArr = new Array();
				this.$u.api.fwjl.getInfo({
						id: id
					})
					.then(res => {
						console.log(res)
						
						// var photoArr = new Array();
						
						this.itemInfo = res.data
						this.picArr= this.picIni(this.itemInfo.pics)
				
				
					
					});
			
			},
			cj(str){
				let codeArr=['zp1','zp2','sz1','sz2','ts','ns','yl','szcj'];
				let strArr=['装配一车间','装配二车间','试制一车间','试制二车间','调试车间','内饰车间','预留区','试装车间'];
				var n=codeArr.indexOf(str)
				if(n!=-1){
					return strArr[n]
				}else{
					return '其他'
				}
			},
			day(str){
				let codeArr=['day','night'];
				let strArr=['白班','夜班'];
				var n=codeArr.indexOf(str)
				if(n!=-1){
					return strArr[n]
				}else{
					return '其他'
				}
			},		  
			leibie(str){
				let codeArr=['lbj','sj','gy','zp','bzj'];
				let strArr=['零部件','设计','工艺','装配','标准件'];
				var n=codeArr.indexOf(str)
				if(n!=-1){
					return strArr[n]
				}else{
					return '其他'
				}
			},
			picIni(strs){ 
			
				
				strs=strs.replaceAll("&quot;","\"");
				
	
				
				
			return JSON.parse(strs)
			},
			getImage(url){
				return "http://172.16.56.250/solve/Public/"+url
			},
			imgPreview(n) {
			var photos=this.picArr
				var urls=new Array();
				for (var i = 0; i < photos.length; i++) {
					urls.push(this.getImage(photos[i].savename))
				}
				uni.previewImage({
					current:n,//为当前显示图片的链接/索引值，不填或填写的值无效则为 urls 的第一张
					indicator: "default",//图片指示器样式，可取值："default" - 底部圆点指示器； "number" - 顶部数字指示器； "none" - 不显示指示器。
					loop: true,
					urls: urls,
			
				})
			},
		},
		onLoad: function(option) { //option为object类型，会序列化上个页面传递的参数
			
			this.getFwjlInfo(option.id)
			
			
		}
	}
</script>

<style lang="scss" scoped>
	.header{
		background-color: #789fe1;
		padding: 10rpx;
		color:#F7F7F7;
		font-weight: bold;
	}
	.u-icon{
		margin-right: 6rpx;
	}
	.fwjlContntDiv{
		padding: 10rpx 15rpx;
		uni-text{
			font-weight: bold;
		}
	
		
	}
</style>
